Brand Morph · animation spec

One dot, always.

The disc is the persistent brand element. The icon's rounded canvas is just a mode — when we transition to the wordmark, the canvas dissolves and the same disc becomes the leading dot of .plus. Never two dots at once.

01 The morph

Press play. Watch the disc — it never disappears. The canvas does.

plus

00:00 0.20s canvas fades 0.55s disc morphs 0.80s "plus" appears 01:30

02 Timing variants

All three loop automatically. Pick the feeling that matches your app.

plus

Classic

1.5s · cubic-bezier(.4,0,.2,1)

Confident, measured. Recommended default for splash.

plus

Snappy

0.6s · same easing

Fast, professional. Use for in-app transitions.

plus

Cinematic

2.2s · same easing

Slower, deliberate. Marketing video only.

03 Static lockup — when both are shown

If you need icon + wordmark together (no animation), the wordmark drops its leading dot. The icon plays that role.

✓ Correct

plus

YES — icon is the dot. Wordmark is just "plus". One dot total. Reads as ".plus" because the icon's disc anchors the sentence.

✕ Wrong

plus

NO — icon's disc + wordmark's leading dot = two dots. The mark contradicts itself. Don't pair them this way.

04 In context — app launch

Tap the phone to replay. This is the actual splash animation.

plus

Meeting intelligence

05 In your Xcode project

A drop-in SwiftUI view. Saved at ios/DesignSystem/Brand/BrandMorphView.swift

// Replace the SplashView body with this:
struct AppRoot: View {
  @State private var ready = false
  var body: some View {
    if ready {
      HomeView()
    } else {
      BrandMorphView(autoPlay: true) { ready = true }
    }
  }
}